<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<!-- <meta http-equiv="Content-Type" content="text/html; charset=gbk"> -->
	<title>小爬虫</title>
	<style>
	</style>
	<link rel="stylesheet" href="style.css">
	<link rel="shortcut icon" href="favicon.ico"/>
	<script src="jquery-2.1.4.js"></script>
</head>
<body>
	<div class="wrap">
		<img src="Spider.png" alt="" id="imag" width="100" height="100">
		<div class="query">
		<select name="" id="sel">
			<option value="1" selected="selected">博客园</option>
			<option value="2">segmentfault</option>
			<option value="3">segment文章</option>
			<option value="4">w3cfuns</option>
			<option value="5">CSDN</option>
			<option value="6">w3ctech</option>
			<option value="7">次碳酸钴</option>
			<option value="8">jquery之家</option>
			<option value="9">javascript吧</option>
		</select>
		<button id="btn">查询
		</button>
		<label for="pagenum">Page:</label><input type="number" value="1" id="pagenum" size="2" maxlength="1" max="99" min="1" width="10">		
	</div>
	
	<div class="box">
		
	</div>
	</div>
	
		
</body>
<script>
var type;
var move;
	$('#sel').on('change',function() {
		type = $("#sel").val()
		if(type == 1 || type == 4 || type == 5 || type == 3 || type == 9 || type== 2) {
			$('#pagenum').val(1);
			$('#pagenum').removeAttr('disabled');
		} else {	
			$('#pagenum').attr('disabled','disabled');
		}
	});
	$('#btn').click(function() {
		$('#imag').addClass('move').css('display','block');
		type = $("#sel").val();
		var page = $('#pagenum').val();
		$.ajax({
			url:"/splwar",
			type:"POST",
			data:{num:page,type},
			success:function(data,status) {
				if(status == "success") {

					$('#imag').removeClass('move').css('display','none');
					$(".box").html(data);
					$('.box').scrollTop(0);
				}
			},
			error:function(data,status) {
				if(status == 'error') {

				}
			}
		});
	});
</script>
</html>